<template>
	<div>
		<le-topbar title="登录">
			<a href="#/register">注册</a>
		</le-topbar>

		<div style="margin: 20px;">
		    <mu-text-field label="输入手机号" v-model="mobile" labelFloat icon="person" @keyup.13.native="login"/>
		    <mu-text-field label="输入密码" v-model="password" labelFloat type="password" icon="lock" @keydown.13.native="login"/>
			<div class="mt_20">
				<mu-raised-button @click="login" label="保存提交" class="demo-raised-button"
					fullWidth primary style="height: 42px;"/>
			</div>
		</div>

		<alerts-dialog :alertData="alertDialog"></alerts-dialog>
	</div>
</template>

<script>
import axios from 'axios'
import md5 from 'md5'
export default{
	data(){
		return {
			mobile: '',
			password: '',
			alertDialog: {}
		}
	},
	methods: {
		login(){
			let params = {
					mobile: parseInt(this.mobile),
					password: this.password
				}
			//手机号码验证
			if(!/^1[3|4|5|8]\d{9}$/.test(params.mobile)){
				this.alertDialog = {
					openState: true,
					content: '请输入正确的手机号码！'
				}
				return false;
			}
			//密码验证
			if(params.password.length < 6 || params.password.length > 18){
				this.alertDialog = {
					openState: true,
					content: '密码长度必须为6~18位'
				}
				return false;
			}
			params.password = md5(params.password).toUpperCase();

			axios.post($base + 'login/goLogin', params).then(json => {
				let data = json.data;
				if(data.error){
					this.alertDialog = {
						openState: true,
						content: data.error
					}
				}else{
					localStorage.mobile = data.mobile;
					this.$store.commit('setBottomNav', 'task')
					this.$router.push('/index');
				}
			}).catch(json => {
				console.log(json)
			})
		},
		logins(){
			console.log(123)
		}
	}
}
</script>